
<div class="container">
	<div class="demo-row">
		<div class="demo-title">Address Book</div>
		<div class="demo-content">
			<div class="alert alert-danger" ng-show="error">{{errorMessage}}</div>
			<div class="row">
				<form ng-submit="addAddressBook(ab)">
					<div class="col-lg-8">
						<input class="form-control" placeholder="Enter First Name" type="text" ng-model="ab.fistname" required min="1">
						<input class="form-control" placeholder="Enter Last Name" type="text" ng-model="ab.lastname" required min="1">
						<input class="form-control" placeholder="Enter Phone" type="text" ng-model="ab.phone" required min="1">
						<input class="form-control" placeholder="Enter Email" type="email" ng-model="ab.email" required min="1">
					</div>
				</form>
				<button class="btn btn-primary" ng-disabled="!ab" ng-hide="editMode" 
						ng-click="addAddressBook(ab)">Add Entry</button>
				<button class="btn btn-primary" ng-disabled="!ab" ng-show="editMode"
						ng-click="updateAddressBook(ab)">Save</button>
				<button class="btn btn-primary" ng-click="resetAddressBookField()">Reset</button>
			</div>
			
			<hr>
			
			<div class="row">
				<div class="col-lg-8">
					<div class="form-group">
						<div class="input-group">
							<input type="text" class="form-control" placeholder="Search" ng-model="searchAddressBook">
							<span class="input-group-btn">
								<button type="submit" class="btn"><span class="fui-search"></span></button>
							</span>
						</div>
					</div>
				</div>
			</div>
			
			<hr>
			
			<div class="alert alert-info" ng-show="addressBooks.length == 0">
				No address book entry found
			</div>
		
			<table class="table table-hover table-striped table-bordered" ng-show="addressBooks.length > 0">
				<thead>
					<tr>
						<th>Id</th>
						<th>First Name</th>
						<th>Last Name</th>
						<th>Phone</th>
						<th>Email</th>
						<th>Update</th>
						<th>Delete</th>
					</tr>
				</thead>
				<tbody>
					<tr ng-repeat="ab1 in addressBooks | filter:searchAddressBook">
						<td>{{ab1.idab}}</td>
						<td>{{ab1.fistname}}</td>
						<td>{{ab1.lastname}}</td>
						<td>{{ab1.phone}}</td>
						<td>{{ab1.email}}</td>
						<td><button class="btn btn-success" ng-click="editAddressBook(ab1.idab)">Update</button></td>
						<td><button class="btn btn-danger" ng-click="deleteAddressBook(ab1.idab)">Delete</button></td>
					</tr>
				</tbody>
			</table>
			<button class="btn btn-danger" ng-click="deleteAllAddressBook()">Delete All Address Book</button>
		</div>
	</div> <!-- End row -->
</div><!--  End container -->